import { FlexLayoutModule } from '@angular/flex-layout';
import { MessageBoxService } from './../../messageBoxService';
import { MaterialModule, MdDialogRef } from '@angular/material';
import { FormsModule } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { Component, ElementRef, AfterViewInit, OnDestroy, OnChanges, Input, Output, SimpleChange, EventEmitter, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

@Component({
    selector: 'div[comfirm]',
    template: `
        <md-dialog-content fxLayout="column"> 
            <div tabindex="0" autofocus class="confirm-content">
                <div class="padding-s text-m">
                    <span>{{title}}</span>
                </div>
                <div class="padding-s break-word">
                    {{content}}
                </div>
            </div>
            <div class="v-gap" fxLayout="row" fxLayoutAlign="space-around">
                <button fxFlex="50%" class="md-primary confirm-btn ok-btn" md-button (click)="ok('ok')" *ngIf="showOK">
                    <span class="color-lightblack">{{confirmText ? confirmText : "确定"}}</span>
                </button>
                <button fxFlex="50%" class="md-primary confirm-btn cancel-btn" md-button (click)="cancel('cancel')" *ngIf="showCancel">
                    <span class="color-lightgray">{{cancletext ? cancletext : "取消"}}</span>
                </button>
                <button fxFlex="50%" class="md-primary confirm-btn" md-button (click)="ignore('ignore')" *ngIf="showIgnore">
                    <span>{{ignoreText ? ignoreText : "忽略"}}</span>
                </button>
            </div>
        </md-dialog-content>
    `,
})
export class Confirm {
    title: string = "温馨提示";
    content: string;
    confirmText: string = "确定";
    cancletext: string = "取消";
    ignoreText: string = "忽略";
    showOK: boolean = true;
    showCancel: boolean = true;
    showIgnore: boolean = false;

    constructor(
        public dialogRef: MdDialogRef<Confirm>
    ) {
        MessageBoxService.Current.Regist(this);
    }

    ok(rType) {
        this.dialogRef.close(rType);
    }

    cancel(rType) {
        this.dialogRef.close(rType);
    }

    ignore(rType) {
        this.dialogRef.close(rType);
    }
}

@NgModule({
    imports: [
        CommonModule,
        FormsModule,
        MaterialModule,
        FlexLayoutModule
    ],
    declarations: [Confirm],
    entryComponents: [Confirm],
    exports: [Confirm],
    schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class ConfirmModule { }

export interface ConfirmParams {
    title?: string;
    content: string;
    showOK?: boolean;
    showCancel?: boolean;
    showIgnore?: boolean;
    confirmText?: string;
    cancelText?: string;
    ignoreText?: string;
}